<template>
  <div>
    <div class="icon">
      <input class="input" type="text" placeholder="大家都在听  边疆" @click="$router.push('/searchBk')">
      <i class="iconfont icon-biaoqing"></i>
      <TC></TC>
      <TE/>
      <TL/>
      <TN/>

      <TM/>
      <TM/>
      <TM/>
      <TM/>
    </div>
  </div>
</template>

<script>
import TC from "./tcircle.vue";
import TE from "./tevery.vue";
import TL from "./tlike.vue";
import TN from "./tnight.vue";
import TM from "./tmusic.vue";
export default {
  components: {
    TC,
    TE,
    TL,
    TN,
    TM
  }
};
</script>

<style scoped>
.input {
  margin-top: 0.3rem;
  border: 1px solid ghostwhite;
  border-radius: 0.6rem;
  height: 0.8rem;
  width: 90%;
  margin: auto;
  text-align: center;
  font-size: 0.28rem;
  background-color: ghostwhite;
}
.icon {
  position: relative;
}
.icon-biaoqing {
  position: absolute;
  top: 0.1rem;
  left: 6.5rem;
  font-size: 0.28rem;
}
</style>
